<script>
import { useUserStore } from '@/store/user.js'

export default {
	data() {
		return {
			name:""
		}
	},
	setup() {
		const userStore = useUserStore()
		return {
			userStore
		}
	},
	methods: {
		updateUser() {
			this.userStore.updateUsername('李四')
		},
		clickBtn(){
		console.log(1);
		this.getUser()
		},
		async getUser(){
		const res = await uni.$http.get('/user')
		this.name = res.data
		}
	}
}
</script>

<template>
	<view class="container">
		<view class="user-info">
			<view class="intro">用户信息：</view>
			<view class="info-item">用户名：{{ userStore.username }}</view>
			<view class="info-item">年龄：{{ userStore.age }}</view>
			<view class="info-item">邮箱：{{ userStore.email }}</view>
			<view class="info-item">格式化信息：{{ userStore.getUserInfo }}</view>
		</view>
		
		<view class="actions">
			<button @click="updateUser">更新用户名</button>
		</view>
    <text>{{this.name}}</text>
    <button @click="clickBtn()">点击</button>
	</view>
</template>



<style>
	.container {
		padding: 20px;
		font-size: 14px;
		line-height: 24px;
	}
	.user-info {
		margin-bottom: 20px;
	}
	.info-item {
		margin: 5px 0;
	}
	.actions {
		margin: 20px 0;
	}
</style>
